body{background: white;margin: 0;padding: 0}
.cherry img{width:50px;height:50px;margin-top:-5%;opacity: 0.8;position: absolute;z-index: 9999;}

#top{width: 100%;height: 100px;border-bottom: 2px solid whitesmoke;line-height: 100px;text-align: center;}
#top img{width: 250px;margin-left: 5%;float: left;margin-top: 0.05px}
#search{width: 25%;display: inline-block;}
#search input{width: 300px;height: 35px;border-radius: 4px;border: 1.8px solid #ffc7f1;padding-left: 5px;outline: none;margin-left: -50px}
#login{width: 15%;display: inline;float: right;position: relative;right: 5%;font-size: 19px;color: #ffc7f1;font-weight: 700}
#login label:nth-of-type(1),label:nth-of-type(3){cursor: pointer;}
#center{width: 15%;height: 99%;float: right;position: relative;right: 5%;font-size: 19px;color: #ffc7f1;font-weight: 700;display: none;}
#center label:nth-of-type(1),label:nth-of-type(3){cursor: pointer;}
#headImg{width: 30px;height: 30px;display: inline-block;position: relative;left: 14%;top: 10%;border-radius: 2em;visibility:hidden}

#section{width: 100%;height: 50px;border-bottom: 2px solid whitesmoke;background-color: rgba(245,245,245,0.2);line-height: 40px}
#musicTable{width: 100%;text-align: center;font-size: 17px;}
#musicTable label,#first{cursor: pointer;font-size: 20px;text-decoration: none;color: black}
#musicTable a:hover{text-decoration: none;color: black}

.caret{margin-left: 7px;width: 5px;}
.carousel{width: 100%;}
.carousel-indicators li{background-color: darkgrey;}
#carousel-example-generic{z-index: -99;}


.dropdown {position: relative;display: inline-block;}
.dropdown-content {display: none;position: absolute;left: 21%;font-size: 16px;background-color: whitesmoke;width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);padding: 12px 16px;}
.dropdown:hover .dropdown-content{display: block;}


#dialog{width:400px;height:540px;border:solid 1px #000;position:fixed; left:50%; margin-left:-200px; top:45%; margin-top:-200px;text-align:center;
         z-index: 10;opacity: 0.95;display: none}
#dialog label:nth-of-type(1){position: absolute;right: 10px;font-size: 30px;cursor: pointer;top: -8px;color: #1c8adb}
img{width: 70px;margin-top: -60px;}
.sign-up-form{width: 300px;box-shadow: 0 0 3px 0 rgba(0,0,0,0.3);background: #fff;padding: 20px;
               margin: 8% auto 0;text-align: center; opacity: 0.95;border-radius: 30px}
#myform input , .signup-btn{margin-top: 7%}
.sign-up-form h1{color: white;margin-bottom: 30px}
.input-box{border-radius: 20px;padding: 10px;margin: 10px 0;width: 90%;border: 1px solid #999;outline: none}
p label{font-size: 16px;position: relative;bottom: 2px}
button{color: #fff;width: 90%;padding: 10px;border-radius: 20px;font-size: 15px;margin: 10px 0;border: none;outline: none;cursor: pointer}
.signup-btn{background: #1c8adb}
#dialog a{cursor: pointer;position: relative;top: 20px;color: white}
hr{width: 80%;margin-top: 20px;}


#dialog2{width:400px;height:540px;border:solid 1px #000;position:fixed; left:50%; margin-left:-200px; top:45%; margin-top:-200px;text-align:center;
         z-index: 10;opacity: 0.95;display: none}
#dialog2 label:nth-of-type(1){position: absolute;right: 10px;font-size: 30px;cursor: pointer;top: -8px;color: #1c8adb}
img{width: 70px;margin-top: -60px;}
.sign-up-form{width: 300px;box-shadow: 0 0 3px 0 rgba(0,0,0,0.3);background: #fff;padding: 20px;
               margin: 8% auto 0;text-align: center; opacity: 0.95;border-radius: 30px}
.sign-up-form h1{color: white;margin-bottom: 30px}
button{color: #fff;width: 90%;padding: 10px;border-radius: 20px;font-size: 15px;margin: 10px 0;border: none;outline: none;cursor: pointer}
.signup-btn{background: #1c8adb}
#dialog2 a{cursor: pointer;position: relative;top: 20px;color: white}
hr{width: 80%;margin-top: 20px;}


footer{width: 100%;background-color: rgba(245,245,245,0.2);font-size: 13px;text-align: center;padding-bottom: 200px;margin-top:20px}
#foot{margin-top: 50px;}
#foot label{cursor: pointer}
#foot>label:not(:first-child){margin-left: 50px}